<!--
 * @Author: fengweicong 75202172+fengweicong@users.noreply.github.com
 * @Date: 2022-02-16 16:53:19
 * @LastEditors: fengweicong 75202172+fengweicong@users.noreply.github.com
 * @LastEditTime: 2022-07-13 20:58:41
 * @FilePath: \B2B\ebuy\src\views\Main\Management\saler\ApplyList\index.vue
 * @Description: 
 * 
 * Copyright (c) 2022 by fengweicong 75202172+fengweicong@users.noreply.github.com, All Rights Reserved. 
-->
<template>
  <div class="applyList">
    <!-- 功能块 -->
    <div class="function">
      <el-button type="primary" size="small" round @click="addProduct">新增</el-button>
    </div>
    <el-dialog :visible.sync="isShowDialog" center width="26%" title="货品标题">
        <el-form>
          <el-form-item class="add-box">
            <el-input
              class="input"
              v-model="product_name"
              placeholder="请输入货品标题"
              maxlength="10"
              show-word-limit
            >
            </el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="saveProduct">确定</el-button>
        </span>
      </el-dialog>

    <!-- 表格 -->
     <div class="table">
      <div class="main_table">
        <el-table
          :key="updateKey"
          :header-cell-style="{ background: '#f5f7fa' }"
          :data="list"
        >
          <el-table-column label="货品标题" prop="product_name"></el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="toEditSuppy(scope.row.id)">编辑</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      </div>
  </div>
</template>
<script>
export default {
  name: 'ApplyList',
  data() {
    return {
      isShowDialog: false,
      product_name: '',

      updateKey: 0,//表格刷新
      nums: 25,
      currentPage: 1, // 当前页码
      total: 0,
      type: "规格ID",
      list:[
        // {
        //   "id" : 2,
        //   "supplier_id" : 2,
        //   "product_name" : "香蕉",
        //   "shelflife" : "6-8个月",
        //   "storage_type" : "常温",
        //   "introduction" : "好吃的香蕉",
        //   "place" : null,
        //   "type" : 1,
        //   "supply" : 1000.00,
        //   "update_time" : "2022-11-11 01:12:20",
        //   "send_area" : null,
        //   "delivery_time" : null,
        //   "description" : "无",
        //   "mature_time" : "一月底，二月中"
        // }
      ],
    };
  },
  methods: {
    saveProduct() {
      this.$API.publishSupply({
        "supplier_id": this.$store.state.saler.saler_id,
        "product_name": this.product_name,
        "introduction": "",
        "type": 0,
        "description": "",
      }).then(res => {
        if (res.status == 201) {
          this.$message.success('供应新增成功，快去完善资料吧~~')
          this.isShowDialog = false
          this.load()
        }
      })
    },
    addProduct() {
      this.isShowDialog = true
      this.product_name = ''
    },
    // 跳转到编辑详细供应的页面
    toEditSuppy(pid) {
      this.$router.push({
        name: 'apply',
        params: {
          pid
        }
      })
    },
    handleCurrentChange(val) {
      this.currentPage = val;
    },
    filterTag(value1, row, column) {
      return row.operationType === value1; //这个返回值就是返回你要展示的内容
    },
    getid(id){
        console.log("id",id);
    },
    // 加载数据
    async load() {
      await this.$API.getSupply().then(response => {
        let sid = this.$store.state.saler.saler_id
        if (response.status == 200 && sid) {
          this.list = []
          for (let obj of response.data) {
            if (obj.supplier_id == sid) this.list.push(obj)
          }
          this.updateKey =  Math.random()
        }
      })
    }
  },
  created() {
    this.load()
  }
};
</script>

<style lang="less" scoped>
/deep/ .el-dialog__body{
  padding-bottom: 0;
}
.applyList{
  display: flex;
  flex-direction: column;
  .function{
    margin-bottom: 20px;
  }
}
</style>